<template>
	<view class="">
		<!-- 	<uni-popup is-mask-click='false' :mask-click='false' style="background-color:rgba(0,0,0,.4);" id="adModal"
			ref="adModal" type="dialog">
			<view class="floatcontainer">
				
			</view>
		</uni-popup> -->
		<view v-show="PlayAd" class="adContainer">
			<view class="">
				<text class="djs">倒计时：{{videoTime}}</text>
				<image @click="JumpAd()" class="jump" src="../../../static/images/yicha/jump.png" mode=""></image>
				<video v-if="isVideo" id="myVideos" autoplay="true" :src="videoSrc" @play='playVideo'
					@timeupdate='playTimes' @error="videoErrorCallback"></video>
				<image v-else style="width: 100%;height: 100%;" :src="ImgSrc" mode=""></image>
				<text class="adText">广告</text>
				<text @tap="togoods" class="buyNow">立即购买</text>
			</view>
			<!-- <video :src="videoSrc"></video> -->

		</view>
	</view>
</template>

<script>
	export default {
		props: {

		},
		data() {
			return {
				shareInfo: {},
				shareLogList: [],
				SpmResult: {},
				userid: '',
				PlayAd: false,
				videoSrc: '',
				videoTime: 0,
				goodsid: '',
				ImgSrc: '',
				isVideo: false

			}
		},
		created() {},

		methods: {
			showModal(val) {
				console.log(val)
				if (val.is_video == '1') {
					this.videoSrc = val.file
					this.isVideo = true
					this.videoTime = Number(val.seconds)
					uni.createVideoContext('myVideos').play()
					this.videoPlay()
				} else {
					this.ImgSrc = val.image
					this.isVideo = false
				}

				this.goodsid = val.wanlshop_goods_id
				this.PlayAd = true

				// this.$refs.adModal.open()
			},
			videoPlay() {

				var timer = setInterval(() => {
					this.videoTime--
				}, 1000)
				if (this.videoTime <= 0) {
					uni.createVideoContext('myVideos').pause()
					this.PlayAd = false
					this.$emit('jumpAd', false)
				}
			},
			JumpAd() {
				uni.createVideoContext('myVideos').pause()
				this.PlayAd = false
				this.$emit('jumpAd', false)
			},
			togoods() {
				uni.createVideoContext('myVideos').pause()
				this.$wanlshop.to(`/pages/product/goods?id=${this.goodsid}`)
			},
			videoErrorCallback() {

			},
			playTimes() {

			},

			playVideo() {

			}
		}

	}
</script>

<style lang="scss">
	.adContainer {
		position: fixed;
		top: 0;
		z-index: 99999;
		width: 536rpx;
		height: 300rpx;
		left: 0;
		right: 0;
		margin: auto;
		top: 180rpx;
	}

	#myVideos {
		width: 100%;
		height: 100%;
	}

	.adContainer {
		view {
			position: relative;
			width: 100%;
			height: 100%;
		}
	}

	.jump {
		position: absolute;
		right: 4px;
		top: 4px;
		width: 38px;
		height: 38px;
		z-index: 999;
	}

	.djs {
		position: absolute;
		left: 4px;
		top: 4px;
		font-size: 7px;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		z-index: 999;
	}

	.adText {
		position: absolute;
		left: 4px;
		bottom: 4px;
		background: #333;
		color: #fff;
	}

	.buyNow {
		width: 204rpx;
		height: 50rpx;
		background: #1387FE;
		border-radius: 3px 3px 3px 3px;
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		text-align: center;
		line-height: 50rpx;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		bottom: 44rpx;
	}
</style>
